import Seo from '@/core/components/Seo';
import AppLayout from '@/core/components/layouts/AppLayout';
import BasicLayout from '@/core/components/layouts/BasicLayout';
import DesktopView from '@/core/components/views/DesktopView';
import MobileView from '@/core/components/views/MobileView';
import addressApi from '@/lib/address/api/addressApi';
import EditAddressComponent from '@/lib/address/components/EditAddress';
import IsAuth from '@/lib/auth/components/IsAuth';

export default function EditAddress({ id, defaultValues }) {
  return (
    <IsAuth>
      <Seo title='Address - Indoteknik.com' />

      <MobileView>
        <AppLayout title='Ubah Alamat'>
          <EditAddressComponent id={id} defaultValues={defaultValues} />
        </AppLayout>
      </MobileView>

      <DesktopView>
        <BasicLayout>
          <EditAddressComponent id={id} defaultValues={defaultValues} />
        </BasicLayout>
      </DesktopView>
    </IsAuth>
  );
}

export async function getServerSideProps(context) {
  const { id } = context.query;
  const address = await addressApi({ id });
  const defaultValues = {
    type: address.type,
    name: address.name,
    email: address.email,
    mobile: address.mobile,
    street: address.street,
    zip: address.zip,
    state: address.stateId?.id || '',
    oldCity: address.city?.id || '',
    city: '',
    oldDistrict: address.district?.id || '',
    district: '',
    oldSubDistrict: address.subDistrict?.id || '',
    subDistrict: '',
    business_name: '',
    longtitude: address?.longtitude || 0,
    latitude: address?.latitude || 0,
    addressMap: address?.addressMap || '',

  };
  return { props: { id, defaultValues } };
}